<template>
  <div class="container">
    <div class="leftMain">
      <slot name="maxShow"></slot>
      <div class="divider">
        <el-divider>
          <font style="font-family: ‘Microsoft YaHei‘;
          font-size: 20px;">最新内容</font>
        </el-divider>
      </div>
      <slot name="newShow"></slot>
    </div>
    <div class="rightMain">
      <slot name="userShow"></slot>
      <slot name="hotBlogs"></slot>
    </div>
  </div>
</template>

<script>
export default {

  name: "myIndexMain"
}
</script>

<style scoped>
.container{
  margin: auto;
  flex-direction: row;
  align-items: center;
  height: auto;
  width: 100%;
}
.leftMain{
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 70%;
  float: left;
}

.rightMain{
  flex-direction: column;
  float: right;
  height: 100%;
  width: 30%;
}
.divider{
  margin: 5px 5px 5px 5px;
  width: 100%;
  height: 20px;
}
</style>